<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>power_update</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
	<link rel="stylesheet" href="<%=basePath%>css/zTreeStyle/demo.css" type="text/css">
	<link rel="stylesheet" href="<%=basePath%>css/zTreeStyle/zTreeStyle.css" type="text/css">
	
	<script src="<%=basePath%>js/jquery-1.7.1.min.js" type=text/javascript></script>
	<script type="text/javascript" src="<%=basePath%>js/jquery.ztree.core-3.5.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/jquery.ztree.excheck-3.5.min.js"></script>
<style type="text/css">
	html, body,div,td {  
	   margin: 0;  
	    padding: 0;  
	    font-size:12px;  
	}  
</style>
<script type="text/javascript">
var setting = {
		check: {
			enable: true,
			//chkboxType: {"Y":"ps", "N":"ps"}
		},
		view: {
			dblClickExpand: false
		},
		data: {
			simpleData: {
				enable: true
			}
		},
		callback: {
			beforeClick: beforeClick,
			onCheck: onCheck
		}
	};

	var zNodes = ${menu};
	

	$(document).ready(function(){
		$.fn.zTree.init($("#treeDemo"), setting, zNodes);
		setting.check.chkboxType = { "Y" : "ps", "N" : "ps" };
	});
	
	function beforeClick(treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("treeDemo");
		zTree.checkNode(treeNode, !treeNode.checked, null, true);
		return false;
	}
	
	function onCheck(e, treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("treeDemo");
		//alert(treeObj.length);
		nodes = zTree.getCheckedNodes(true);
		v = "";
		for (var i=0, l=nodes.length; i<l; i++) {
			v += nodes[i].id + ",";
		}
		if (v.length > 0 ) v = v.substring(0, v.length-1);
		var idObj = $("#menuIds");
		idObj.attr("value", v);
		
		getOperbuttons(treeNode.id);
	}
	
	function getOperbuttons(nodeId){
		var params = {"id" : nodeId}; 
		var actionUrl = "admin/power!getOperbuttons.action";
		$.ajax({
			url : actionUrl,
			data : params,
			dataType : "text",
			cache : false,
			error : function(textStatus, errorThrown) {
				alert("系统ajax交互错误: " + textStatus);
			},
			success : function(data, textStatus) {
				//显示在右侧div中，check列表
				setCheckbox(nodeId);
			}
		});
	}
	
	function setCheckbox(id){
		alert(id);
		for(var i=0;i<4;i++){
			var str = '<label><input type="checkbox" name="a" >a' + i + '</label>';
			//$('buttonList').html(str);
		}
		
	}
</script>

  </head>
  
  <body>
		<div class="zTreeDemoBackground left" style="width:300px;float:left;">
			<ul id="treeDemo" class="ztree"></ul>
		</div>
		<div style="margin-left:400px;">
			<form action="admin/power!powerMenuSave.action" method="post">
				<div id="buttonList">
					
				</div>
				
				<s:hidden id="menuIds" name="menuIds"></s:hidden>
				<s:hidden name="group.id"></s:hidden>
				<input type="submit" value="提交"/>
				<input type="reset" value="重置"/>
			</form>
			
		</div>
</body>
</html>
